<template>
    <div id="w_summary">
        <!-- <div @touchend='showValue=true'>阿萨德飞{{showValue}}</div> -->
        <div class="summaryPop" v-transfer-dom>
            <popup v-model="showValue" @on-hide="doCancle" position="bottom"> <!-- -->
                <group :title="'任务总结:'+ task!=null?task.title:''">
                    <x-input v-model="smyTitle" title="标题" required placeholder="必填" ></x-input>
                    <x-textarea v-model="smydesc" title="描述" placeholder="请填写详细信息[选填]" :show-counter="true" :rows="3"></x-textarea>
                    <x-input v-model="smydesc1" title="做的好的" placeholder="选填" ></x-input>
                    <x-input v-model="smydesc2" title="需要提升" placeholder="选填" ></x-input>
                    <x-input v-model="smydesc3" title="异动原因" placeholder="延迟完成,提前完成的原因" ></x-input>
                    <x-input v-model="smydesc4" type="number" :min="0" :max="3" title="满 意 度" placeholder="满分100分" @on-change="docheck"></x-input>
                    <x-input v-model="smydesc5" title="解决方法" placeholder="下次如何快速完成" ></x-input>
                </group>
                <box  gap="10px 10px">
                    <flexbox>
                        <flexbox-item>
                          <x-button type="primary" @click.native="doSummary">确定</x-button>
                        </flexbox-item>
                        <flexbox-item>
                          <x-button type="warn" @click.native="doCancle">取消</x-button>
                        </flexbox-item>
                    </flexbox>
                </box>
            </popup>
        </div>

    </div>
</template>
<script>
import moment from "moment";

import api from '../../api';
import {
    mapState,
    mapActions
} from 'vuex'
import Vue from 'vue';

import { taskAndTag  } from "../mixin";

import {
    TransferDomDirective as TransferDom,    
    Popup,XButton, Group,Box, XInput,XTextarea,Flexbox, FlexboxItem,Datetime      
} from 'vux'

export default {
    directives: {
        TransferDom
    },
    components: {    
        Popup,XButton, Group,Box, XInput,XTextarea,Flexbox, FlexboxItem,Datetime,
    },
    props:{        
        task: [Object], 
        show: Boolean,
    },
    mixins: [taskAndTag],    
    computed: {
        ...mapState({
            taskCurr: state => state.z39.taskCurr,
        })
    },
    watch: {        
        show(val){            
            this.showValue = val ;
        }
    },
    created() {
        
    },
    mounted: function() {
        
    },
    methods: {
        doSummary(){
            if( this.smyTitle.length == 0 ) return this.$vux.toast.show({text: "请填内容" ,type: 'warn'})
            
            let desc = "" ;
            desc = this.smydesc ;
            desc += this.smydesc1?`\n做的好的:${this.smydesc1}`:"" ;
            desc += this.smydesc2?`\n需要提升:${this.smydesc2}`:"" ;
            desc += this.smydesc3?`\n异动原因:${this.smydesc3}`:"" ;
            desc += this.smydesc4?`\n满 意 度:${this.smydesc4}`:"" ;
            desc += this.smydesc5?`\n解决方法:${this.smydesc5}`:"" ;
            console.log(this.smyTitle,desc);

            let data = {title:this.smyTitle} ;            
            data.desc = desc  || "" ;
            data.state = "summary" ;
            if( this.task ){
               data.parid = this.task.parid || this.task.id ; 
            }
            let tags = {summary:moment().format('YYYY-MM-DD HH:mm')} ;
            // this.doTagSet(this.task,"summary") ;   //总结任务需要修改状态吗,不修改更好.
            this.taskAdd(data,tags).then(tdata => {
                var target ;
                if( this.task.parid && this.taskCurr && this.task.parid== this.taskCurr.id ){
                    target = this.taskCurr; //父任务
                }else{
                    target = this.task ;
                }
                if(target.tasks==undefined) Vue.set(target,"tasks",[])
                target.tasks.push(tdata);
                this.$store.commit({ type: "z39/taskToDB", tasks: [tdata], act: "add" });
                this.showValue = false ;
				this.$emit('update:show', this.showValue) ;
				this.$emit('on-close',false) ; 
                this.doReset();
			});  
            
        },
        doReset(){
            this.smyTitle="";
            this.smydesc ="";
            this.smydesc1="";
            this.smydesc2="";
            this.smydesc3="";
            this.smydesc4="";
            this.smydesc5="";
        },
        doCancle(){
            this.showValue = false ;
             this.$emit('update:show',this.showValue) ; 
            this.$emit('on-close',false) ;         
                this.doReset();
        },
        docheck(val){
            if(parseInt(val)>100){
                setTimeout(()=>{this.smydesc4 = val.substr(0,2)},100)
            }
            // console.log("docheck:",val,this.smydesc4);
        },
        ...mapActions([
            
        ])
    },
    data() {
        return {
          taskitem:{title:""},
          smyTitle:"",
          smydesc:"",
          smydesc1:"",
          smydesc2:"",
          smydesc3:"",
          smydesc4:"",
          smydesc5:"" ,
          showValue:false ,
        }
    }
}

</script>
<style scoped>

</style>
